<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>车辆状况填报</title>
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/styles.css">
</head>
<body style="background: transparent;">
    <div class="form-container">
        <h2>车辆状况填报</h2>
        
        <!-- 时间段标识 -->

        <form action="<%=request.getContextPath() %>/ddm/zktbServlet"  id="startForm" style="display: block;" method="post">
            <div class="form-header">
                <h3>用车开始状况填报</h3>
            </div>
            <div class="form-group">
                <label>初始油量（L）</label>
                <input type="text" name="soil" class="form-control" min="0" step="0.1" placeholder="请输入当前油量" required>
            </div>
            <div class="form-group">
                <label>初始里程（km）</label>
                <input type="text" name="omil"class="form-control" min="0" placeholder="请输入当前里程数" required>
            </div>
            <div class="form-group">
                <label>车辆状况</label>
                <select class="form-control" name="zhuang"required>
                    <option value="">请选择车辆状况</option>
                    <option>正常</option>
                    <option>轻微故障</option>
                    <option>需要维修</option>
                </select>
            </div>
            <div class="form-group">
                <label>状况说明</label>
                <textarea class="form-control" name="shuo"rows="4" placeholder="请详细描述车辆当前状况..."></textarea>
            </div>
            <div class="form-footer">
                <button type="submit" class="btn">提交报告</button>
            </div>
        </form>

    </div>

    <script>
        function switchTab(type) {
            const startForm = document.getElementById('startForm');
            const endForm = document.getElementById('endForm');
            const tabs = document.querySelectorAll('.time-tab');
            
            if (type === 'start') {
                startForm.style.display = 'block';
                endForm.style.display = 'none';
                tabs[0].classList.add('active');
                tabs[1].classList.remove('active');
            } else {
                startForm.style.display = 'none';
                endForm.style.display = 'block';
                tabs[0].classList.remove('active');
                tabs[1].classList.add('active');
            }
        }
    </script>
</body>
</html> 